<template>
  <div>
    <div class="pdt20"></div>
    <van-cell-group inset>
      <van-form @submit="onSubmit">
        <Popover label="区域" category="区域" v-model="formData.areaID" />
        <Popover
          label="场地"
          category="场地"
          :query="{ ID_Area: formData.areaID }"
          @select="handlePlaceChange"
          v-model="formData.ID_Place"
        />
        <Popover label="6S类型" category="6S类型" v-model="formData.ID_Type" />

        <Popover
          label="预计时间"
          Type="dateTime"
          :closeable="false"
          :title="false"
          :minDate="minDate"
          :minHour="minHour"
          :minMinute="minMinute"
          :minSecond="minSecond"
          v-model="formData.ExpectTime"
        />
        <Popover
          label="备注"
          Type="textarea"
          :required="false"
          v-model="formData.Description"
        />
        <Popover
          label="附件"
          :required="true"
          :detail="false"
          Type="file"
          v-model="formData.Files"
        />
        <div
          class="title mgt10"
          v-show="formData.ID_Place"
          style="margin-left: 16px; font-size: 14px; font-weight: bold"
        >
          6S执行项
        </div>
        <van-cell
          center
          :title="item.Content"
          v-for="(item, index) in SixItemList"
          :key="index"
        >
          <template #right-icon>
            <van-switch
              :active-value="1"
              :inactive-value="2"
              v-model="item.State"
              active-color="#67C23A"
              inactive-color="#dcdee0"
              :size="22"
            />
          </template>
        </van-cell>
        <div style="margin: 30px 10px;">
          <van-button round block type="primary" native-type="submit">
            提交
          </van-button>
        </div>
      </van-form>
    </van-cell-group>
  </div>
</template>

<script setup name="SubmitSix">
// import Popover from "@/views/Amobile/components/Popover";
import { GetSixSalePlanDetail } from '@/api/sixManage/executionPlan.js';
import { AddSixSaleData } from '@/api/sixManage/mySix.js';
import { ref } from 'vue';
import { useRouter } from 'vue-router';
const { proxy } = getCurrentInstance();
const router = useRouter();
const formData = ref({});
const SixItemList = ref([]);
const minDate = new Date();
const minHour = proxy.$moment().format('YYYY-MM-DD HH:mm:ss').slice(11, 13);
const minMinute = proxy.$moment().format('YYYY-MM-DD HH:mm:ss').slice(14, 16);
const minSecond = proxy.$moment().format('YYYY-MM-DD HH:mm:ss').slice(17, 19);
console.log(minHour, minMinute, minSecond);
async function handlePlaceChange(item) {
  try {
    let res = await GetSixSalePlanDetail({ ID: item.ID_6SPlan });
    res.data.Items?.forEach(item => (item.State = 1));
    SixItemList.value = res.data.Items;
  } catch (error) {
    console.log(error);
  }
}
async function onSubmit() {
  try {
    let query = {
      ...formData.value,
      Files: formData.value?.Files?.map(item => {
        return {
          FileID: item.ID,
          Sort: item.Sort
        };
      }),
      Items: SixItemList.value
    };
    let res = await AddSixSaleData(query);
    router.push({ path: '/SixManage/SixDetail', query: { ID: res.data } });
  } catch (error) {
    console.log(error);
  }
}
</script>

<style lang="scss" scoped></style>
